Video Title: Claude Code + GitHub WORKFLOW for Complex Apps
Video ID: FjHtZnjNEBU
Video URL: https://www.youtube.com/watch?v=FjHtZnjNEBU
Export Date: 2026-04-30 14:49:13
Channel: Greg Baugues
Format: markdown
================================================================================

# Unlocking Superpowers in Web App Development with AI: A Deep Dive into an AI-Driven Coding Workflow

Over the past few weeks, I've been experimenting with a powerful coding workflow that integrates Cloud Code and GitHub to build a web app. This workflow has fundamentally transformed how I develop software—almost like unlocking new superpowers. In this post, I’ll walk you through this AI-assisted software development lifecycle, share key insights, and explain why this approach could revolutionize your coding projects too.

---

## The AI Coding Workflow at a Glance

At a high level, the workflow revolves around four core phases:

1. **Plan** – Break down big features into small, manageable GitHub issues.
2. **Create** – Use AI (Cloud Code) to generate the code for each issue.
3. **Test** – Automatically run tests and simulate UI interactions to verify correctness.
4. **Deploy** – Commit changes to GitHub, open pull requests (PRs), review, and merge to deploy.

Here’s how it works in practice:

- I start by creating detailed GitHub issues outlining the work to be done.
- Cloud Code uses a custom slash command with clear instructions to process each issue.
- It plans the work by breaking issues down into atomic tasks using "scratchpads"—a workspace for organizing thoughts.
- Then, it writes code, runs tests (including Puppeteer-driven browser tests for UI changes), and commits the work.
- PRs are either reviewed by me or by Cloud Code itself using specialized review commands.
- Continuous integration (CI) via GitHub Actions runs automated tests and lint checks on every commit to ensure safety before merging.
- After merging, I clear Cloud Code’s context to start fresh on the next issue.

---

## Why You Need a Structured Cycle Even with Powerful AI

You might wonder, "If AI can write code, why bother with all these steps?" The truth is, writing code is only one phase of successful software delivery.

This workflow mirrors the classical software development life cycle (SDLC): plan, create, test, deploy. It’s based heavily on the well-established **GitHub Flow**, a lightweight branching workflow designed for small teams—perfect for a human paired with an AI assistant.

Managing software with a clear cycle ensures maintainability, quality, and iterative progress. AI coding assistants excel within this framework because they can focus on specific, well-defined tasks rather than vague or sprawling objectives.

---

## Step 1: Creating and Refining GitHub Issues

My journey began by dictating initial app requirements, which I turned into a structured document with the help of Claude (an AI assistant). From there, Claude generated about 30-40 GitHub issues.

Lesson learned: **not all issues are created equal.** Initially, I was overly optimistic and assumed I could jump straight from issue creation to coding. Instead, I had to spend significant time refining and breaking down those issues into very granular, atomic tasks.

The more specific and tightly scoped the issues were, the better Claude’s output became. This process felt like slipping back into an engineering manager role—writing detailed specs, reviewing code, leaving feedback, and sometimes rejecting work that didn’t meet expectations.

---

## Step 2: Setting Up Your Development Foundation

Before rapid development can begin, you need a solid foundation:

- **GitHub Repository**: Where your code, issues, and PRs live.
- **Test Suite & Continuous Integration**: I heavily rely on Rails’ integrated testing framework and GitHub Actions for CI to automatically run tests and linters on every commit.
- **Puppeteer for UI Testing**: Puppeteer allows Claude to simulate real browser interactions, clicking buttons and filling forms to verify UI changes.

Getting these pieces right upfront ensures that Claude’s code contributions don’t break existing functionality and that your app remains stable as it evolves.

---

## Step 3: Planning with Custom Slash Commands

A critical innovation in this workflow is the use of **custom slash commands** in Cloud Code. These are prompt templates designed to guide Claude in processing issues.

For example, my main slash command for handling issues is divided into four parts: plan, create code, test, deploy. The **planning phase** is the most important:

- Claude uses the GitHub CLI to fetch issue details.
- It searches previous scratchpads and PRs for context.
- It enters a "think harder" mode to break the issue down into manageable subtasks.
- It writes a detailed plan linked back to the GitHub issue.

This methodical planning helps Claude approach coding with clarity and context, improving the quality of generated code and reducing errors.

---

## Step 4: Create, Test, and Deploy - Trust but Verify

After planning, Claude writes code and commits changes. A common question is: **Should Claude commit code or should the human do it?**

Inspired by Thomas Tacic’s influential post, I’ve grown comfortable letting Claude handle commits and pull request creation. However, I always review the PRs—sometimes manually, sometimes by using a dedicated PR review slash command where Claude reviews its own work in the style of Sandy Metz, a renowned Rails expert known for writing maintainable code.

Testing is crucial here. With a robust suite and Puppeteer browser tests, I gain confidence that Claude’s changes don’t break existing features. This safety net lets me merge PRs knowing the app remains stable.

For deployment, I use **Render**, a cloud platform that automatically deploys on merges to the main branch. So merging a PR effectively means deploying to production.

---

## Human vs. AI: Finding Your Balance

In this workflow, the human role is primarily in the **planning and reviewing phases**. I spend most of my time crafting detailed specs, reviewing PRs, and guiding Claude with comments and feedback.

For smaller projects, I can delegate much of the coding, testing, and deploying to Claude. This division of labor maximizes productivity while ensuring quality.

---

## Managing Context with /clear

After finishing work on an issue, I use a `/clear` command to wipe Claude’s context window completely. This forces Claude to start fresh on the next issue, relying solely on the issue description, scratchpads, and codebase history.

This approach prevents "context pollution," reduces token usage, and improves performance by making each issue self-contained.

---

## Claude via GitHub Actions: When to Use It

Anthropic’s Claude integration with GitHub Actions is a neat feature that lets you tag Claude directly in GitHub to work on issues. However, it currently bills API usage separately—even if you have a Claude Max plan—which can add unexpected costs.

I find better value and control using Claude Code from the console, especially for larger, meaningful code changes. GitHub Actions integration is best suited for small fixes like copy edits or tiny tweaks that don’t require deep context.

---

## Work Trees: Running Parallel AI Agents

Work trees let you run multiple Cloud Code instances in parallel on different git branches, similar to multitabling in online poker.

Although powerful in theory, I found this approach challenging in practice:

- Managing multiple directories and permissions became tedious.
- Constantly reapproving permissions and cleaning up merge conflicts felt like babysitting.

For my current project size and complexity, a single Cloud Code instance suffices. However, work trees could be valuable for larger teams or projects that can develop truly independent features in parallel.

---

## Final Thoughts

This AI-driven workflow—grounded in classic software development principles but supercharged with Cloud Code and GitHub integration—has genuinely elevated my productivity and coding experience.

Key takeaways:

- Invest time upfront refining **granular, atomic GitHub issues**.
- Build a strong foundation with **automated testing and CI**.
- Use **custom slash commands** to guide AI planning and coding.
- Embrace human involvement in **planning and review**, while delegating repetitive tasks.
- Manage AI’s context carefully with `/clear` to avoid token bloat.
- Use GitHub Actions for **small fixes**, and consider work trees for **parallel work** when appropriate.

If you’re curious about AI-assisted software development, this workflow offers a practical, battle-tested blueprint that balances automation and human oversight for building maintainable, high-quality apps.

---

### Further Resources

- [Thomas Tacic’s post on AI-assisted coding](https://link-to-article) — A must-read on the realities of working with AI in software development.
- [GitHub Flow](https://guides.github.com/introduction/flow/) — Understand the branching model that inspired this workflow.
- [Cloud Code Documentation](https://cloudcode.ai/docs) — Learn how to create custom slash commands and integrate Claude into your coding.

For a deeper dive into Cloud Code tips, check out my [video on Claude Code Pro Tips](#).

---

With AI as your coding partner, the future of software development is collaborative, efficient, and exciting. Happy coding!